<template>
  <div class="findheader">
        <div class="top">
          <h3>发现</h3>
          <span class="iconfont search">&#xe627;</span>
      </div>
      <div class="content">
          <div class="big_img">
              <img src="../../../../static/images/find1.png" alt="">
          </div>
          <div class="small_img">
                <div class="modular" v-for="item in findList" :key="item.id">
                    <img :src="item.imgUrl" alt="">
                    <!-- {{item.name}} -->
                </div>
          </div>
      </div>
  </div>
</template>


<script>

export default {
  name: 'FindHeader',
  props:{
      findList:Array
  },
  data () {
    return {
        
    }
  }
}
</script>


<style lang="stylus" scoped>

.findheader   
    width 100%
    height 50%
    background-color #fff
    .top
        width 100%
        border-bottom 1px solid #ccc
        h3  
            font-size .36rem
            text-align center
            padding .2rem
            font-weight bold
        span 
            float right
            font-size .44rem
            margin -.6rem .2rem
            font-weight bold
    .content
        width 100%
        margin-top 1px 
        height auto
        position relative
        .big_img
            width 100%
            img 
                width 100%
        .small_img
            width 100%
            height 2.6rem
            .modular
                width 32%
                float left
                margin-top .1rem
                margin-right 2%
                img 
                    width 100%
            .modular:last-child
                margin-left 0
                margin-right 0 
</style>
